<script setup lang="ts">
import { ref, onMounted, onUnmounted } from "vue";
import { test } from "@/api/user";
import fadingBackground from "./fadingBackground.vue";
defineOptions({
  name: "Welcome"
});

const text = ref("");
const windowHeight = ref(window.innerHeight);

// 更新窗口高度的函数
const updateWindowHeight = () => {
  windowHeight.value = window.innerHeight;
};


onMounted(() => {
  window.addEventListener("resize", updateWindowHeight);
  test().then((res: string) => {
    console.log(res);
    text.value = res;
  });
});

onUnmounted(() => {
  window.removeEventListener("resize", updateWindowHeight);
});
</script>

<template>
  <div :style="{ height: `${windowHeight - 133}px` }">
    <fadingBackground :des="text" />
  </div>
</template>
